import ProForm from '@ant-design/pro-form'
import { Col, Row } from 'antd'
import React from 'react'
import ChessItem from '../ChessItem'
import styles from './index.less'
import { handleTime, ruleType } from '../Exercises';

interface Params {
  area?: any[]
}
export default function WkPlaying(props: Params) {
  const { area } = props;
  const content =
    area?.map((item) => {
      const { id, ruleType: rule, timeLimit, value, compareType, timeUnit } = item?.warningRole ?? {}
      const { id: iId } = item
      const i = 122;
      const j = 133;
      const { id: comId, ruleType: comRule, timeLimit: comtimeLimit, timeUnit: comtimeUnit, value: comValue, compareType: compareType1 } = item?.completeRole ?? {}
      return {
        i: value ? id : null, name: `${handleTime(timeUnit) || ''}${ruleType(rule, value) || ''}${rule == 5 || rule == 6 || rule == 12 || rule == 13 || value == 0 || rule == 16 ? '' : compareType ? compareType == 1 ? '高于' : '低于' : ''}`, value: timeLimit || '7',
        ii: value ? `${id}${j + 1}` : null, nextName: `${rule == 1 || rule == 2 || rule == 9 || rule == 10 || rule == 3 ? '%预警' : rule == 16 ? "预警" : '局预警'}`, value1: value || (rule == '3' && compareType == 2 ? "40" : rule == "4" && compareType == 2 ? "15" : "5"),
        iii: comtimeUnit != 0 ? comId : null, nextpName: `${handleTime(comtimeUnit) || ''}${ruleType(comRule, undefined, comtimeUnit) || ''}${comRule == 6 || comRule == 5 || comRule == 12 || comRule == 13 || comRule == 19 || comRule == 11 || comRule == 16 ? '' : compareType1 ? (compareType1 == 1 ? '高于' : '低于') : ''}`, value2: comtimeLimit || '5', value3: comValue || (comRule == "3" ? "15" : "5"),
        iiii: comValue ? `${comId}${i + 1}` : null, nextppName: `${comRule ? comRule == 1 || comRule == 2 || rule == 3 || comRule == 9 || comRule == 10 ? '%完成' : comRule == 16 ? "完成" : "局完成" : ''}`, iId, isEnable: `${item?.isEnable}`, rule, comRule, timeUnit, comtimeUnit
      }
    })
  // [
  //   {
  //     i: 'play1', name: '天内对弈胜率低于', value: '7', ii: 'paly11', nextName: '%预警', value1: '40%', iii: 'paly111', nextpName: '局内对弈胜率高于', value2: '5', value3: "40%", iiii: 'play1111', nextppName: '%完成'
  //   }
  // ]
  return (
    <div className={styles.chess_recruit} >
      <div style={{ marginBottom: '10px' }}>悟空对弈</div>
      <div style={{ overflow: 'auto' }}>
        <Row style={{ textAlign: 'center', flexWrap: 'nowrap' }}>
          <Col className={styles.border_style} span={10}>预警规则</Col>
          <Col className={styles.border_style} span={10}>完成规则</Col>
          <Col className={styles.border_style} span={4}>启用状态</Col>
        </Row>
        <ProForm.Item
        >
          {
            content?.map((item: any) => {
              return <ChessItem item={item} key={item?.id} />
            })
          }
        </ProForm.Item>
      </div>
    </div>
  )
}
